<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"  
                xmlns:h="http://java.sun.com/jsf/html"  
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./../templates/FoodSageTemplate.xhtml">

    <ui:define name="logout">
        <p:commandLink id="logoutLink" actionListener="#{touristLogoutManagedBean.doLogout}" value="#{bundle['login.logout.label']}" ajax="false" immediate="true" />
    </ui:define>

    <ui:define name="main_menu">
        <f:view beforePhase="#{itineraryChooseItineraryTypeManagedBean.initView}"/>
        <p:menubar model="#{itineraryChooseItineraryTypeManagedBean.touristMainMenuModel}"/>
    </ui:define>

    <ui:define name="nav_menu">
        <p:menu model="#{itineraryChooseItineraryTypeManagedBean.touristNavMenuModel}"/>
    </ui:define>

    <ui:define name="content">

        <h:form id="mainForm">
            <h1>Validate a voucher</h1>

            <p:fieldset style="width:950px">

                <p:ajaxStatus style="width:16px;height:16px;">
                    <f:facet name="start">
                        <h:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" />
                    </f:facet>
                    <f:facet name="complete">
                        <h:outputText value="" />
                    </f:facet>
                </p:ajaxStatus>
                <p:fieldset>
                    <p:message id="referenceNumberMsg" for="referenceNumber" />
                    <h:panelGrid columns="3" border="1" columnClasses="column" cellpadding="5">
                        <h:outputText value="Enter voucher's reference number: " style="font-weight:bold; text-align:center; font-size:12px" />
                        <p:inputText required="true" requiredMessage="Voucher's reference number is required." id="referenceNumber" value="#{customerULPManagerBean.inputReferenceNumber}">
                            <p:ajax event="blur" update="referenceNumberMsg" />
                        </p:inputText>
                        <p:commandButton id="submitbutton" value="Validate" update="panel" actionListener="#{customerULPManagerBean.validateVoucher}" ajax="true" />
                    </h:panelGrid>

                </p:fieldset>
                <p:messages />
                <br/>
                <br/>    
                <p:fieldset rendered="#{customerULPManagerBean.voucherExist}">
                    <h2>POINT REDEMPTION DETAIL</h2>
                    <h:panelGrid columns="2" border="1" columnClasses="column" cellpadding="5">
                        <h:panelGrid columns="2" border="1" columnClasses="column" cellpadding="5">

                            <h:outputText value="Voucher Reference Number: " style="font-weight:bold; text-align:center; font-size:12px" />
                            <h:outputText value="#{customerULPManagerBean.selectedRedemption.referenceNumber}" />

                            <h:outputText value="Voucher name: " style="font-weight:bold; text-align:center; font-size:12px" />
                            <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.name}" />

                            <h:outputText value="Redemption Date:" style="font-weight:bold; text-align:center; font-size:12px"/>
                            <h:outputText value="#{customerULPManagerBean.selectedRedemption.dateCreated}">
                                <f:convertDateTime dateStyle="full" pattern="EEE, dd/MM/yyyy" timeZone="EST" type="date" />
                            </h:outputText>

                            <h:outputText value="Expiry Date: " style="font-weight:bold; text-align:center; font-size:12px"/>
                            <h:outputText value="#{customerULPManagerBean.selectedRedemption.dateExpired}">
                                <f:convertDateTime dateStyle="full" pattern="EEE, dd/MM/yyyy" timeZone="EST" type="date" />
                            </h:outputText>

                            <h:outputText value="Offered by: " style="font-weight:bold; text-align:center; font-size:12px"/>
                            <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.corpName}"/>

                            <h:outputText value="Total points used: " style="font-weight:bold; text-align:center; font-size:12px"/>
                            <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.pointsToRedeem} points"/>

                            <h:outputText value="Status: " style="font-weight:bold; text-align:center; font-size:12px"/>
                            <h:outputText value="#{customerULPManagerBean.returnRedemptionStatus(customerULPManagerBean.selectedRedemption.dateUsed==null)}"/>
                        </h:panelGrid>
                        <p:graphicImage id="imageDisplay" value="/images/upload/media/#{customerULPManagerBean.selectedRedemption.redemptionList.imageURL}"
                                        height="300" width="450"/> 
                    </h:panelGrid>
                </p:fieldset>
                <br/> 

                <p:fieldset legend="Company's contact details" toggleable="true" toggleSpeed="500"
                            onToggleUpdate="growl" style="width:900px" rendered="#{customerULPManagerBean.voucherExist}">
                    <h:panelGrid columns="2" columnClasses="column" cellpadding="5">
                        <h:outputText value="Company name: " />
                        <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.corpName}" />

                        <h:outputText value="Phone number: " />
                        <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.corpContactNumber}" />

                        <h:outputText value="Email address: " />
                        <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.corpEmail}" />

                        <h:outputText value="Office number: " />
                        <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.address.houseNumber}" />

                        <h:outputText value="Building name: " />
                        <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.address.buildingName}" />

                        <h:outputText value="Street name: " />
                        <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.address.streetName}" />

                        <h:outputText value="Postal code: " />
                        <h:outputText value="#{customerULPManagerBean.selectedRedemption.redemptionList.stakeholder.address.postalCode}" />

                    </h:panelGrid>
                </p:fieldset>
            </p:fieldset>
            <br/>
            <p:commandButton id="back" value="Back" ajax="true" action="tourist/VisitorViewLoyaltyPointAccount?faces-redirect=true"/> 
        </h:form>
    </ui:define>
</ui:composition>


